<!DOCTYPE html>
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <title>CirclePoint Hotels</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/datepicker.css" rel="stylesheet">
	<link href="css/bootstrap-responsive.css" rel="stylesheet">
	<script src="./js/jquery.js"></script>
    <style type="text/css">
    body {
		padding-top: 60px;
		padding-bottom: 40px;
    }
	html,
	body {
    height: 100%;
	}
 
	#wrap {
		min-height: 100%;
		height: auto !important;
		height: 100%;
		margin: 0 auto -60px;
	}
	#push,
	#footer {
		height: 60px;
	}
    </style>
    <script type="text/javascript">
$(document).ready(function(){
   $("#login").click(function(){
    
        username=$("#Email").val();
        password=$("#Password").val();
         $.ajax({
            type: "POST",
            url: "processlogin.php",
            data: "email="+username+"&pwd="+password,
            success: function(html){
              if(html=='true')
              {
				$("#divlogin").html("			<p class='navbar-text pull-right'>Logged In</p>");
				location.reload();
              }
              else
              {
					alert('Incorrect Password');
              }
            }
        });
         return false;
    });
});
</script>

  </head>

  <body>

    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="brand" href="/">CirclePoint Hotels</a>
          <div class="nav-collapse collapse">
            <ul class="nav">
              <li class="active"><a href="home.php">Home</a></li>
              <li><a href="about.php">About</a></li>
              <li><a href="contact.php">Contact</a></li>
              <li><a href="register.php">Register</a></li>
            </ul><div id="divlogin">
			<form class='navbar-form pull-right'><input class='span2' id='Email' type='text' placeholder='Email'><input class='span2' id='Password' type='password' placeholder='Password'><button type='submit' id='login' class='btn'>Sign in</button></form></div>
          </div>
        </div>
      </div>
    </div>

    <div class="container">	
	<h1>Guest Registration</h1>
	    <form class="form-horizontal">
		
	<div class="control-group">
	<label class="control-label" for="inputTitle">Title</label>
    <div class="controls">
	<input class="span3" type="text" required>   
	</div>
    </div>
		
    <div class="control-group">
	<label class="control-label" for="inputFirstName">First Name</label>
    <div class="controls">
	<input class="span3" type="name" required>  
    </div>
    </div>
	
	<div class="control-group">
    <label class="control-label" for="inputLastName">Last Name</label>
    <div class="controls">
    <input class="span3" type="name" required>  
    </div>
	</div>

	
	<div class="control-group">
	<label class="control-label" for="inputHomePhone"> Home Phone</label>
	<div class="controls">
    <input type = "tel" 
    pattern = "\(\d{3}\) +\d{3}-\d{4}" required /> 
    (###)###-####
	</div>
	</div>
	
	<div class="control-group">
	<label class="control-label" for="inputMobilePhone"> Mobile Phone</label>
	<div class="controls">
    <input type = "tel" 
    pattern = "\(\d{3}\) +\d{3}-\d{4}"  /> 
    (###)###-####
	</div>
	</div>
	
	<div class="control-group">
    <label class="control-label" for="inputAddres">Address</label>
    <div class="controls">
	<input class="span3" type="address" required>  
    </div>
	</div>
	<div class="control-group">
    <label class="control-label" for="inputcity">City</label>
    <div class="controls">
	<input class="span3" type="city" required>  
    </div>
	</div>
	<div class="control-group">
    <label class="control-label" for="inputZip">Zip Code</label>
    <div class="controls">
	<input type = "Zip" 
    pattern = "d{6}" required  /> 
    </div>
	</div>
	
	<div class="control-group">
    <label class="control-label" for="inputEmail">Email</label>
	<div class="controls">
    <input class="span3" type="email" required>  
	</div>
	</div>
    
    <div class="control-group">
    <div class="controls">
    <button type="submit" class="btn">Send Information</button>
    </div>
    </div>
	</form>
	
   
		<?php

if(!$_POST['page']) die("0");

$page = (int)$_POST['page'];

if(file_exists('pages/page_'.$page.'.php'))
echo file_get_contents('pages/page_'.$page.'.php');

else echo 'Error: This Page Is Not Here';
?>
               
<hr>
<div id="footer">
        <p>© CirclePoint Hotels 2013</p>
</div>

          </div>
      



      <hr>

     

    </div> 
	
  
	
	<script src="./js/bootstrap.min.js"></script>
	<script src="./js/bootstrap-datepicker.js"></script>
    <script src="./js/bootstrap-transition.js"></script>
    <script src="./js/bootstrap-alert.js"></script>
    <script src="./js/bootstrap-modal.js"></script>
    <script src="./js/bootstrap-dropdown.js"></script>
    <script src="./js/bootstrap-scrollspy.js"></script>
    <script src="./js/bootstrap-tab.js"></script>
    <script src="./js/bootstrap-tooltip.js"></script>
    <script src="./js/bootstrap-popover.js"></script>
    <script src="./js/bootstrap-button.js"></script>
    <script src="./js/bootstrap-collapse.js"></script>
    <script src="./js/bootstrap-carousel.js"></script>
    <script src="./js/bootstrap-typeahead.js"></script>
<script>
		$(function(){
			window.prettyPrint && prettyPrint();
			$('#dp1').datepicker({
				format: 'mm-dd-yyyy'
			});
			$('#dp2').datepicker();
			$('#dp3').datepicker();
			$('#dp3').datepicker();
			$('#dpYears').datepicker();
			$('#dpMonths').datepicker();
			
			
			var startDate = new Date(2012,1,20);
			var endDate = new Date(2012,1,25);
			$('#dp4').datepicker()
				.on('changeDate', function(ev){
					if (ev.date.valueOf() > endDate.valueOf()){
						$('#alert').show().find('strong').text('The start date can not be greater then the end date');
					} else {
						$('#alert').hide();
						startDate = new Date(ev.date);
						$('#startDate').text($('#dp4').data('date'));
					}
					$('#dp4').datepicker('hide');
				});
			$('#dp5').datepicker()
				.on('changeDate', function(ev){
					if (ev.date.valueOf() < startDate.valueOf()){
						$('#alert').show().find('strong').text('The end date can not be less then the start date');
					} else {
						$('#alert').hide();
						endDate = new Date(ev.date);
						$('#endDate').text($('#dp5').data('date'));
					}
					$('#dp5').datepicker('hide');
				});

        // disabling dates
        var nowTemp = new Date();
        var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);

        var checkin = $('#dpd1').datepicker({
          onRender: function(date) {
            return date.valueOf() < now.valueOf() ? 'disabled' : '';
          }
        }).on('changeDate', function(ev) {
          if (ev.date.valueOf() > checkout.date.valueOf()) {
            var newDate = new Date(ev.date)
            newDate.setDate(newDate.getDate() + 1);
            checkout.setValue(newDate);
          }
          checkin.hide();
          $('#dpd2')[0].focus();
        }).data('datepicker');
        var checkout = $('#dpd2').datepicker({
          onRender: function(date) {
            return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
          }
        }).on('changeDate', function(ev) {
          checkout.hide();
        }).data('datepicker');
		});
	</script>
  

</body></html>